﻿<div>

<h2>JavaScript 代码：</h2>
<textarea name="dp-syntaxhighlighter" class="brush: js; highlight: [13,14,15]" >

    $(function () {
        var t = $("#t").tabs({
            width: 600,
            height: 200,
            lineHeight: 0,
            enableConextMenu: true,
            enableNewTabMenu: true
        });

        $("#Button1").click(function () {
            var title = $("#Text1").val(), href = $("#Text2").val(), iniframe = $("#Checkbox1")[0].checked;
            if (!title || !href) { return $.messager.show("您输入要新添加的选项卡的标题和路径"); }
            t.tabs("add", {
                title: title, href: href, iniframe: iniframe, closable: true
            });
        });
    });

</textarea>
<h2>HTML 代码：</h2>
<textarea name="dp-syntaxhighlighter" class="brush: html; highlight: [10]" >
    
    <p>
        <input id="Button1" type="button" value="添加新选项卡" />
        选项卡标题：<input id="Text1" type="text" />
        选项卡路径：<input id="Text2" type="text" />
        <input id="Checkbox1" type="checkbox" /><label for="Checkbox1">是否通过 IFRAME 加载：</label>
    </p>
    <div id="t">
        <div data-options="title: 'tab1', href: 'tabs/refreshable/code.html', refreshable: true">tab1</div>
        <div data-options="title: 'tab2', refreshable: false">tab2</div>
        <div data-options="title: '项目根目录', refreshable: true, iniframe: true, href: '/'"></div>
    </div>

</textarea>


</div>